html(lang="en")
	include header
	link(rel='stylesheet' href='http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css')
	script(src="./js/jsplumb/jquery.jsPlumb-1.5.5-min.js")
	script(src='http://code.jquery.com/jquery-1.9.1.js')
	script(src="http://code.jquery.com/ui/1.10.4/jquery-ui.js")
	script(src="./js/scenario.js")
	link(rel="stylesheet", href="./css/scenario.css")
	body
		include nav
		div(id="scenario_id", style="visibility:hidden;")=id
		div(id="scenario_type", style="visibility:hidden;")=type
		
		div(class="col-md-12")
			div(class="panel panel-default text-center")
				h3=name
		div(class="col-md-10")
			div(class="panel panel-default")
				div(class="panel-heading text-center")
					h4=access_url 
				div(class="panel-body")
					div(id="main")
						div(id="scenario-container", class="scenario-container")
							for service in services
								div(class="w", id="service" + service.id, data-port=service.status)=service.display_name
									div(id="service_data_" + service.id)
									table(id="service_trust_" + service.id, class="service_trust_data table table-bordered")
									div(class="ep")
		div(class="col-md-2")
			div(class="panel panel-default")
				div(class="panel-heading text-center")
					h4 Scenario
				div(class="panel-body")
					div
						div(class="col-md-6")
							button(id="btn_toggle_svc", class="btn btn-danger svc_toggle") Stop Services 
						div(class="col-md-6")
							button(class="btn btn-primary try-it", data-link=access_url) Make Request
						div(class="col-md-12 scenario_stats text-center")
							a(href='./show_scenario_stats?type=' + type + '&s_id=' + id) Scenario Statistics
		div(class="col-md-2")
			div(class="panel panel-default")
				div(class="panel-heading text-center")
					h4 Actions
				div(class="panel-body")
					div(id="scenario-actions")
		div(class="col-md-2")
			div(class="panel panel-default")
				div(class="panel-heading text-center")
					h4 Interaction Authorization
				div(class="panel-body")
					div(id="int-authz-policies")
		div(class="col-md-12")
			div(class="panel panel-default")
				div(class="panel-heading text-center")
					h4 Trust Management
				div(class="panel-body", style="height:400px")
					div(id="trust-mgmt-policies")
		div(class="col-md-4" id="scenario_config")
			div(class="panel panel-default")
				div(class="panel-heading text-center")
					h4 Scenario Configuration
				div(class="panel-body")
					div(class="input-group")
						for service in services
							div(class="row top-buffer")
								div(id=service.status, class="col-md-2 svc_status")=service.status
								div(id=service.status + "_" + service.id, class="col-md-5 svc_name")=service.display_name
								div(class="col-md-5")
									div(class="slider", id=service.id value=service.grade)
